/*
   Image Resizer CSS
   
   require jQuery.Interface (jquery.interface.js)
   by Aiden Kim 2013
*/


.imgResizePanel {
	position: relative;
	overflow: show;
	width: 100%;
}
.imgResizeBackground {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	opacity:0.5;
	filter:alpha(opacity=50);
	filter: grayscale(0.7);
	-moz-filter: grayscale(0.7);
	-o-filter: grayscale(0.7);
	-ms-filter: grayscale(0.7);
	-webkit-filter: grayscale(0.7);
	/* Firefox 3.5+ */
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter: gray;
}
.imgResizeBox {
	position: absolute;
	cursor: move;
}
.imgResizeForegroundContainer {
	position: absolute;
	overflow: hidden;

	-moz-box-shadow: 3px 3px 4px #808080;
	-webkit-box-shadow: 3px 3px 4px #808080;
	box-shadow: 3px 3px 4px #808080;
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#808080')";
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#808080');
}
.imgResizeForeground {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
}

.imgResizeHandleSE,
.imgResizeHandleE,
.imgResizeHandleNE,
.imgResizeHandleN,
.imgResizeHandleNW,
.imgResizeHandleW,
.imgResizeHandleSW,
.imgResizeHandleS
{
	display: none;
	position: absolute;
	width: 8px;
	height: 8px;
	background-color: #333;
	border: 1px solid #fff;
	overflow: hidden;
}
.imgResizeHandleSE {
	bottom: -10px;
	right: -10px;
	cursor: se-resize;
}
.imgResizeHandleE {
	top: 50%;
	right: -10px;
	margin-top: -5px;
	cursor: e-resize;
}
.imgResizeHandleNE {
	top: -10px;
	right: -10px;
	cursor: ne-resize;
}
.imgResizeHandleN {
	top: -10px;
	left: 50%;
	margin-left: -5px;
	cursor: n-resize;
}
.imgResizeHandleNW {
	top: -10px;
	left: -10px;
	cursor: nw-resize;
}
.imgResizeHandleW {
	top: 50%;
	left: -10px;
	margin-top: -5px;
	cursor: w-resize;
}
.imgResizeHandleSW {
	left: -10px;
	bottom: -10px;
	cursor: sw-resize;
}
.imgResizeHandleS {
	bottom: -10px;
	left: 50%;
	margin-left: -5px;
	cursor: s-resize;
}
